<template>
  <div id="box">
    <el-card header="请登录">
      <el-form @submit.native.prevent="login">
        <el-form-item label="用 户 :">
          <el-input v-model="model.username" />
        </el-form-item>
        <el-form-item label="密 码 :">
          <el-input type="password" v-model="model.password" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" class="loginBtn" native-type="submit">登录</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
  export default {
    name: 'Login',
    data() {
      return {
        model: {
          username: '',
          password: ''
        }
      }
    },
    methods: {
      async login() {
        // const res = await this.axios.post('http://wuwei.dayaar.com.cn:5432/admin-login', this.model)
        // .then(res => {
        //   console.log(res);
        // })
        if (this.model.username !== 'wuwei' && this.model.password !== '1234') {
          alert('用户名或密码错误')
        } else if (this.model.username !== 'aron' && this.model.password !== '1234') {
          alert('用户名或密码错误')
        } else {
          window.sessionStorage.username = this.model.username
          this.$router.push('/admin');
          this.$message({
            type: 'success',
            message: '登录成功'
          })
        }
        
        // 把服务器返回的 用户信息 记录到 sessionStorage
        // window.sessionStorage.username = res.data.username
        // window.sessionStorage.headimgurl = res.data.headimgurl

        
      }
    }
  }
</script>

<style scoped>
  #box {
    width: 30%;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .loginBtn {
    width: 100%;
  }
</style>